@import "../../styles/_variable.scss";
@import "../../styles/mixin.scss";
.box {
	position: fixed;
	top: 0;
  left: 0;
  z-index: 9;
	width: 750rpx;
	height: 100vh;
	background-color: rgba(0, 0, 0, .3);
	@include flex-center;
	&-form {
    transition: transform .2s ease-in-out;
    &.top2up {
      transform: translateY(-120rpx);
    }
		width: 640rpx;
		background-color: $main-bg;
		border-radius: 24rpx;
		font: 600 36rpx $font-family-medium;
		color: $theme-color;
		text-align: center;
		.title {
			padding: 40rpx 0 10rpx;
			border-bottom: 2rpx solid rgba(255, 255, 255, 0.05);
			margin-bottom: 20rpx;
		}
		.input {
			padding: 0 48rpx;
			&-pool {
        font-weight: normal;
				background-color: #F1F1F1;
				height: 108rpx;
				border-radius: 12rpx;
				padding: 0 28rpx;
				color: #3c3c3c;
				text-align: center;
			}
			&-place {
				color: $sub-color;
			}
		}
		.footer {
			margin-top: 50rpx;
			padding-bottom: 10rpx;
			border-top: 2rpx solid #E6E6E6;
			@include flex;
			&-btn {
				flex: 1;
				@include flex-center;
				font: 500 34rpx $font-family-medium;
				height: 100rpx;
				&.bdl {
					border-left: 2rpx solid #E6E6E6;
				}
				&.confirm {
					color: $theme-color;
				}
				&.cancel {
					color: $sub-color;
				}
			}
		}
	}
}